import { DialogForm } from 'custom/index'
import CompanyPerms from '../components/CompanyPerms.vue'
import DataPerms from '../components/DataPerms.vue'
import MenuIdList from '../components/MenuIdList.vue'
import { addRole, getRoleDetail, updateRoleDetail, getUserList, dispatchUser, searchDispatchUser } from '../api'

const addDialog = new DialogForm('DialogForm')

addDialog
  .title('新增角色')
  .postApi(addRole)
  .useGroup('基础信息')
    .useItem('roleName').label('角色名称').required().end()
    .useItem('remark').label('描述').setProps({ type: 'textarea', autosize: true }).required().end()
    .upto('DialogForm')
  .useGroup('权限配置')
    .useCustomItem(CompanyPerms, 'companyPerms').end()
    .useCustomItem(DataPerms, 'dataPerms').end()
    .useCustomItem(MenuIdList, 'menuIdList').setDefault([]).end()

const editDialog = new DialogForm('DialogForm')

editDialog
  .title('编辑角色')
  .getApi((_, row) => getRoleDetail({ roleId: row.roleId }))
  .postApi(updateRoleDetail)
  .useGroup('基础信息')
    .useItem('roleName').label('角色名称').required().end()
    .useItem('remark').label('描述').setProps({ type: 'textarea', autosize: true }).required().end()
    .upto('DialogForm')
  .useGroup('权限配置')
    .useCustomItem(CompanyPerms, 'companyPerms').end()
    .useCustomItem(DataPerms, 'dataPerms').end()
    .useCustomItem(MenuIdList, 'menuIdList').setDefault([]).end()

const authorizationDialog = new DialogForm('DialogForm')

authorizationDialog
  .title('添加成员')
  // .getDefaultData((_, row) => ({ roleId: row.roleId, userIds: row.userIds || [] }))
  .getApi((_, row) => searchDispatchUser({ roleId: row.roleId }))
  .postApi(dispatchUser)
  .useGroup('')
    .useApiSelect('userIds', getUserList).setProp('multiple', true).setProp('valueKey', 'userId').setProp('labelKey', 'name').end()

export {
  addDialog,
  editDialog,
  authorizationDialog
}
